{extend name="base" /}
{block name="title"}
<title>会员充值-{$site_config.site_title}</title>
{/block}
{block name="body"}
<script src="__JS__/jquery.qrcode.min.js" type="text/javascript" charset="utf-8"></script>
<header class="page-header2">
			<a href="javascript:;" onClick="javascript:history.back(-1);"><img src="__STATIC__/img/back02.png" class="back_img" style="float:left;"/></a>
			<h3>会员充值</h3>
			<a href="{:url('home/user/payList')}"><h4>记录</h4></a>
		</header>
		<form method="post" action="{:url('home/user/upGradePayPost')}">
		<div class="members_prepaid">
			<div class="members_prepaid_top">
				<div class="members_prepaid_list">
					{foreach name="rank_list" item="vo" key="k"}
					<div class="members_prepaid_list01 {eq name="vo.id" value="$rank_id"}active{/eq}" >
						<div class="members_prepaid_list01_left">
							<img src="__STATIC__/img/member_choose_rank0{$vo.id-1}.png" class="member_choose_rank01"/>
						</div>
						<div class="members_prepaid_list01_right">{$vo.reg_money-$user_info.reg_money}</div>
					</div>
					{/foreach}
				</div>
			</div>
			
			<div class="members_prepaid_center" style="margin-bottom: 200px;">
				<div class="members_prepaid_center_title">选择充值方式：</div>
				<div class="members_prepaid_center_list">
					<div class="members_prepaid_center_list_left">
						<img src="__STATIC__/img/member_pay01.png" style="width:100%;"/>
					</div>
					<div class="members_prepaid_center_list_center">支付宝</div>
					<div class="members_prepaid_center_list_right">
						<div class="timecar-radio">
							<label for="timecar" onselectstart="return false" class="">
								<input type="radio" name="type" id="timecar1" value='11' checked="" />
							</label>
						</div>
					</div>
				</div>
				
				<div class="members_prepaid_center_list">
					<div class="members_prepaid_center_list_left">
						<img src="__STATIC__/img/member_pay02.png" style="width:100%;"/>
					</div>
					<div class="members_prepaid_center_list_center">微信支付</div>
					<div class="members_prepaid_center_list_right">
						<div class="timecar-radio">
							<label for="timecar" onselectstart="return false" class="timecar-radioed">
								<input type="radio" name="type" id="timecar2" value='22'/>
							</label>
						</div>
					</div>
				</div>				
			</div>
			<!-- 要升级的用户等级 -->
			<input type="hidden" name="rank_id" value="{$rank_id}">
			<!-- <div class="members_prepaid_btn" style="position: fixed;">立即充值</div> -->
			<!-- <button type="button" class="members_prepaid_btn" style="position: fixed;border: 0;" id="h-submit">立即充值</button> -->
			<button type="submit" class="members_prepaid_btn" style="position: fixed;border: 0;">立即充值</button>
		</div>
		</form>
		
		<div class="pop-panel13">
			<div class="details3 ">
				<div class="notice_content3">
					<div class="notice_list3">
						<div class="notice_list3_title">
							<div class="notice_list3_title01">充值成功</div>
							<div class="notice_list3_title02">赠送玉米59颗</div>
						</div>
						<div class="notice_list3_center">
							<div class="notice_list3_i">
								<img src="__STATIC__/img/member_corn01.png" class="notice_list3_img"/>
							</div>
							<div class="notice_list3_number">X59</div>
						</div>
					</div>
				</div>
			</div>
			<div class="close3">
						<img src="__STATIC__/img/member_close.png" style="width:60%;"/>
					</div>
			<div class="bg3"></div>
		</div>
		<!-- 这里存放支付二维码 -->
		<div id="code" style="display: none;">
			<div style="width: 250px;margin: 0 auto;" >
				<div id="qrcode"></div>
			</div>
		</div>
		<!-- 这里存放支付二维码 -->

	<script type="text/javascript">
		/*$('.members_prepaid_btn').click(function(){
			$('.pop-panel13').show();
		});*/
		$('.close3').click(function(){
			$('.pop-panel13').hide();
		});
	</script>
	
	<script type="text/javascript">
		/*$('.members_prepaid_list01').click(function(){
			$(this).addClass('active').siblings().removeClass('active');
		})*/
	</script>
	
	<script type="text/javascript">
		$(".timecar-radio label").on('touchstart',function(){
			if($(this).hasClass('timecar-radioed')){
				$(".timecar-radio label").addClass("timecar-radioed")
				$(this).removeClass("timecar-radioed")
			}
		})
	</script>

<script>
var SCOPE = {
  'post_url' : "{$post_url}"
}
/**
 * 提交form表单操作
 */
$("#h-submit").click(function(){
    //$("#h-submit").attr("disabled",true);
    var data = $("#h-form").serializeArray();
    postData = {};
    $(data).each(function(i){
       postData[this.name] = this.value;
    });
    // 将获取到的数据post给服务器
    url = SCOPE.post_url;
    $.post(url,postData,function(result){
    	//console.log(result);return false;
    	// 弹出二维码付款
        if(result.status == 1) {
        	// 付款地址
        	$pay_url = result.message;
        	// 清空二维码
        	$("#qrcode").html('');
        	// 支付地址转成二维码
        	$("#qrcode").qrcode({
				render: "table", //table方式
				width: 250, //宽度
				height:250, //高度
				text: result.message //任意内容
			});
			// 获取支付二维码
			var code = $("#code").html();
        	layer.open({
			    title: [
			    	'扫码支付',
			    	'background-color: #FF4351; color:#fff;'
			    ]
			    ,content: code
			 });
        	
            //dialog.success(result.message,result.url);
        }else if(result.status == 0) {
            // 失败
            dialog.error(result.message,result.url);
            //$("#h-submit").attr("disabled",false);
            return false;
        }
    },"JSON");
});
</script>

<script src="__JS__/layer/mobile/layer.js" type="text/javascript" charset="utf-8"></script>
<script src="__JS__/mdialog.js" type="text/javascript" charset="utf-8"></script>
{/block}

